import { ClassAttributes, HTMLAttributes } from 'react';
import { TextArea } from 'antd-mobile';
import ProcessLog from '@inbiz/basic/WapProcessLog';
import NoData from '@components/business/process/ProcessCenter/preview/wap/NoData';
import { TextWidget, getMessage } from '@inbiz/react';
import { getEditor } from '@inbiz/utils';
import { useInbizRouter } from '@inbiz/hooks';
import '../locale';
import './index.less';

const EformProcessLog = (props: any) => {
  const { className, processQueryData } = props;
  const router = useInbizRouter();
  let _query = router.location.query;
  let _instanceId = processQueryData?.instanceId || _query?.instanceId || '';
  let _processId = processQueryData?.processId || _query?.processId || '';
  const isEditor = getEditor();

  return (
    <div className={className} {...props}>
      {isEditor ? (
        <div className={`${'formLog'}  ${className}`}>
          {/* <h4>
            <TextWidget>ProcessLogBtn.pLog.processLog</TextWidget>
          </h4> */}
          <TextArea value={getMessage('ProcessLogBtn.pLog.noLog')} rows={5} />
        </div>
      ) : (_instanceId || _processId) ? (
        <ProcessLog className={className} type="detail" hasButton={true} instanceId={_instanceId || ''} processId={_processId || ''} />
      ) : (
        <NoData />
      )}
    </div>
  );
};

export default EformProcessLog;
